<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <!-- 远程引用css -->
    <link
      rel="stylesheet"
      href="//at.alicdn.com/t/font_1844301_hexhjz9wk4a.css"
    />
    <style type="text/css">
      /* 默认icon（svg引用） */
      .icon {
        /* width: 10em;
        height: 10em; */
        vertical-align: -0.15em;
        fill: currentColor;
        overflow: hidden;
      }
    </style>
    <script src="//at.alicdn.com/t/font_1844301_hexhjz9wk4a.js"></script>
  </head>
  <body>
    <style>
      .transform {
        width: 60px;
        margin: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s;
        box-shadow: 0px 1px 0px 0 #666;
      }
      .transform:hover {
        transform: scale(2);

        cursor: pointer;
      }
    </style>
    <div class="iconfont icon-beixin"></div>
    <i class="iconfont icon-sousuo"></i>
    <i class="icon-sousuo"></i>
    <div class="transform">
      <svg class="icon" aria-hidden="true">
        <use xlink:href="#icon-duanku"></use>
      </svg>
    </div>
  </body>
</html>
